import 'package:flutter/material.dart';
import 'package:untitled9/commit_page.dart';

import 'HouseManagement_page.dart';

class ChooseHouse extends StatefulWidget {
  const ChooseHouse({super.key});

  @override
  State<ChooseHouse> createState() => _ChooseHouseState();
}

class _ChooseHouseState extends State<ChooseHouse> {
  @override
  Widget build(BuildContext context) {
    double scrW = MediaQuery.of(context).size.width;
    double scrH = MediaQuery.of(context).size.height;
    return Scaffold(
      appBar: AppBar(
        leading: GestureDetector(
            onTap: () {
              Navigator.push(context, MaterialPageRoute(builder: (context) {
                return HouseManagementPage();
              }));
            },
            child: Center(
                child: Text(
              'back',
              style: TextStyle(color: Colors.white),
            ))),
        automaticallyImplyLeading: false,
        backgroundColor: Color.fromRGBO(195, 161, 162, 1.0),
        title: Center(
            child: Text(
          'Choose a house',
          style: TextStyle(color: Colors.white),
        )),
        actions: [
          GestureDetector(
            onTap: () {
              Navigator.push(context, MaterialPageRoute(builder: (context) {
                return CommitPage();
              }));
            },
            child: Text(
              'next   ',
              style: TextStyle(color: Colors.white),
            ),
          )
        ],
      ),
      body: Row(
        children: [
          Container(
            width: scrW / 3,
            child: Column(
              children: [
                Container(
                    margin: EdgeInsets.symmetric(vertical: 5),
                    child: Text(
                      'House Temolata 1',
                      style: TextStyle(color: Colors.red),
                    )),
                Container(
                    margin: EdgeInsets.symmetric(vertical: 5),
                    child: Text('House Temolata 2')),
                Container(
                    margin: EdgeInsets.symmetric(vertical: 5),
                    child: Text('House Temolata 3')),
                Container(
                    margin: EdgeInsets.symmetric(vertical: 5),
                    child: Text('House Temolata 4')),
              ],
            ),
          ),
          Container(
            width: 1,
            color: Colors.black,
          ),
          Expanded(
            child: ListView(
              children: [
                Container(
                  child: Column(
                    children: [
                      Column(
                        children: [
                          Container(
                              margin: EdgeInsets.symmetric(vertical: 10),
                              child: Text(
                                'Room Name',
                                style: TextStyle(
                                    fontSize: 18, fontWeight: FontWeight.w600),
                              )),
                          Wrap(
                            runSpacing: 10,
                            spacing: 15,
                            children: [
                              Cell(),
                              Cell(),
                              Cell(),
                              Cell(),
                              Cell(),
                            ],
                          )
                        ],
                      ),
                      const SizedBox(
                        height: 5,
                      ),
                      Column(
                        children: [
                          Container(
                              margin: EdgeInsets.symmetric(vertical: 10),
                              child: Text(
                                'Room Name',
                                style: TextStyle(
                                    fontSize: 18, fontWeight: FontWeight.w600),
                              )),
                          Wrap(
                            runSpacing: 10,
                            spacing: 15,
                            children: [
                              Cell(),
                              Cell(),
                              Cell(),
                              Cell(),
                            ],
                          )
                        ],
                      ),
                      const SizedBox(
                        height: 5,
                      ),
                      Column(
                        children: [
                          Container(
                              margin: EdgeInsets.symmetric(vertical: 10),
                              child: Text(
                                'Room Name',
                                style: TextStyle(
                                    fontSize: 18, fontWeight: FontWeight.w600),
                              )),
                          Wrap(
                            runSpacing: 10,
                            spacing: 15,
                            children: [
                              Cell(),
                              Cell(),
                              Cell(),
                              Cell(),
                              Cell(),
                            ],
                          )
                        ],
                      ),
                      const SizedBox(
                        height: 5,
                      ),
                      Column(
                        children: [
                          Container(
                              margin: EdgeInsets.symmetric(vertical: 10),
                              child: Text(
                                'Room Name',
                                style: TextStyle(
                                    fontSize: 18, fontWeight: FontWeight.w600),
                              )),
                          Wrap(
                            runSpacing: 10,
                            spacing: 15,
                            children: [
                              Cell(),
                              Cell(),
                              Cell(),
                              Cell(),
                              Cell(),
                            ],
                          )
                        ],
                      ),
                      const SizedBox(
                        height: 5,
                      ),
                    ],
                  ),
                ),
              ],
            ),
          )
        ],
      ),
    );
  }
}

class Cell extends StatelessWidget {
  const Cell({
    super.key,
  });

  @override
  Widget build(BuildContext context) {
    return Column(
      children: [
        Container(
          height: 60,
          width: 60,
          decoration: BoxDecoration(border: Border.all(width: 1)),
          child: Center(child: Text('device\nimage')),
        ),
        Text(
          'Device Name',
          style: TextStyle(fontSize: 12),
        )
      ],
    );
  }
}
